{% extends '::twoColumnLayout.html.twig' %}

{% block javascripts %}
    {{ parent() }}
     <script src="{{ asset('js/likes.js') }}" type="text/javascript"></script>
     <script src="{{ asset('js/postForm.js') }}" type="text/javascript"></script>
     <script src="{{ asset('js/replyForm.js') }}" type="text/javascript"></script>
     <script src="{{ asset('js/formImageActions.js') }}" type="text/javascript"></script>
{% endblock %}

{% block content %}
        <div id="content_left">
            <div id="formMenu" {% if showForm %} class="formBool" {% endif %}>
                <p>
                    <a class="add_post_button" href="{{ path('MooiWallBundle_WallAdd', {'name': wallOwner.username}) }}">Voeg een bericht toe</a>
                </p>
                {% include 'MooiWallBundle:Wall:postForm.html.twig' %}
            </div>
            {% for wallOwnerPost in wallOwnerPosts %}
            <div class="post">
                <h2>
                    {{ wallOwnerPost.getSender.displayName }}<span> over </span>{{wallOwnerPost.getSubject}}
                </h2>
                
                <a name="post{{ wallOwnerPost.getId }}"></a>
                <img class="avatar {% if app.user.getId == wallOwnerPost.getSender.getId %}right{% else %}left{% endif %}" src="{{ wallOwnerPost.getSender.avatarUrl|apply_filter('thumbnail') }}" alt="avatar" />
                <div class="postInfoWrapper">
                    <div class="postWrapper">
                        <p class="post_text">
                            {{ wallOwnerPost.getText()|nl2br }}
                        </p>
                        {% if wallOwnerPost.images|length > 0 %}
                        <div class="image_gallery">
                            <h3>Plaatjes</h3>
                            <ul>
                                {% spaceless %}
                                    {% for image in wallOwnerPost.images %}
                                        {% if image.id != null %}
                                            <li>
                                                <a href="{{ asset(image.webPath) }}" rel="lightbox[{{ wallOwnerPost.id }}]">
                                                    <img src="{{ image.webPath | apply_filter('thumbnail') }}" alt="{{ image.name }}" />
                                                </a>
                                            </li>
                                        {% endif %}
                                    {% endfor %}
                                {% endspaceless %}
                            </ul>
                        </div>
                        {% endif %}
                    </div>
                    <ul class="postItems">
                        <li>
                            <a class="like_button" href="{{ path('MooiWallBundle_WallLike', {'postId' : wallOwnerPost.getId()}) }}">Vind ik goed</a>
                            <p class="likes">
                                {% if wallOwnerPost.getLikes() %}
                                    (<span>{{ wallOwnerPost.getLikes() }}</span>)
                                {% endif %}    
                            </p>
                        </li>
                        <li><a class="commentButton" href="{{ wallOwnerPost.getId() }}">Reageer</a></li>
                        <li>{{ wallOwnerPost.time|date('d-m-Y') }}</li>
                    </ul>
                </div>
                <div class="clearfix"></div>
                {% if wallOwnerPost.getWallOwner.getId == wallOwnerPost.getSender.getId or is_granted('ROLE_TEACHER') %}
                <a href="{{ path('MooiWallBundle_WallEdit', {'postId': wallOwnerPost.getId() }) }}">
                    <img class="edit_post_button" src="{{ asset('images/edit_post_button.png') }}" alt="" />
                </a>
                <a class="confirm" href="{{ path('MooiWallBundle_WallDelete', {'postId' : wallOwnerPost.getId()}) }}">
                            <img class="delete_post_button" src="{{ asset('images/close_delete.png') }}" alt="" />
                            <h3 class="head">Bericht verwijderen</h3>
                            <p class="body">Weet je zeker dat je het bericht van {% if app.user.getUserName == wallOwnerPost.sender.username %} jezelf {% else %} {{ wallOwnerPost.sender.displayName }} {% endif %} wilt verwijderen?</p>
                        </a>
                {% endif %}
            </div>
            <div class="replies">
                {% if wallOwnerPost.getReplies | length > 0 %}
                <h2>Reacties</h2>
                {% endif %}
                {% for reply in wallOwnerPost.getReplies %}
                <div class="reply">
                    {% if app.user.id == reply.getSender.getId or is_granted('ROLE_TEACHER') %}
                        <ul class="replyMenu">
                            <li>
                                <a href="{{ path('MooiWallBundle_WallReplyEdit', {'replyId': reply.getId }) }}#reply{{ reply.getId }}">
                                    <img class="edit_post_button" src="{{ asset('images/edit_post_button.png') }}" alt="" />
                                </a>
                            </li>
                            <li>
                                <a class="confirm" href="{{ path('MooiWallBundle_WallReplyDelete', {'replyId' : reply.getId()}) }}">
                                    <img class="delete_post_button" src="{{ asset('images/close_delete.png') }}" alt="" />
                                    <h3 class="head">Reactie verwijderen</h3>
                                    <p class="body">Weet je zeker dat je de reactie van {% if app.user.getUserName == wallOwnerPost.sender.username %} jezelf {% else %} {{ wallOwnerPost.sender.displayName }} {% endif %} wilt verwijderen?</p>
                                </a>
                            </li>
                        </ul>
                    {% endif %}
                    {% if reply.getSender.getId == wallOwnerPost.getSender.getId %}
                        <img src="{{ reply.getSender.avatarUrl|apply_filter('thumbnail') }}" alt="avatar" class="avatar_left avatar" />
                        <p class="reply_right">
                            <a name="reply{{ reply.getId }}" href="{{ path('MooiWallBundle_WallIndex', {'userName': reply.getSender.getUserName }) }}">{{ reply.getSender.displayName }}</a> {{ reply.text }}
                        </p>
                    {% else %}
                        <img src="{{ reply.getSender.avatarUrl | apply_filter('thumbnail') }}" alt="avatar" class="avatar_right avatar" />
                        <p class="reply_left">
                            <a name="reply{{ reply.getId }}" href="{{ path('MooiWallBundle_WallIndex', {'userName': reply.getSender.getUserName }) }}">{{ reply.getSender.displayName }}</a> {{ reply.text }}
                        </p>
                    {% endif %}
                    <ul class="replyItems {% if app.user.getId == wallOwnerPost.getSender.getId %}left{% endif %}">
                        <li>
                             <a class="like_button" href="{{ path('MooiWallBundle_WallReplyLike', {'replyId' : reply.getId()}) }}">Vind ik goed</a>
                            <p class="likes">
                                {% if reply.getLikes() %}
                                    (<span>{{ reply.getLikes() }}</span>)
                                {% endif %}    
                            </p>
                        </li>
                        <li>{{ reply.time|date('d-m-Y') }}</li>
                    </ul>
                </div>
            {% if editReplyForm is defined %}
                <div class="replyEditForm">
                    <div id="replyFormShow{{ reply.getId }}" class="replyFormCheck{% if reply.getReplyForm.show %} formReplyBool{% endif %}" >
                        {% form_theme reply.getReplyForm.form '::baseForm.html.twig' %}
                        <form class="replyForm replyFormShow{{ reply.getId() }}" action="{{ path('MooiWallBundle_WallReplyEdit', {'replyId' : reply.getId()}) }}" method="post" autocomplete="off" {{ form_enctype(reply.getReplyForm.form ) }} >
                            <div class="form_row">
                                <div class="clearfix"></div>
                            </div>
                            {{ form_widget(reply.getReplyForm.form ) }}
                            <div class="button">
                                <input type="submit" class="button" value="Plaatsen" />
                                <div class="clearfix"></div>
                            </div>
                        </form>
                    </div>
                </div>
            {% endif %} 
                {% endfor %}
            </div>
            <div class="replyAddForm">
                <div id="replyFormShow{{ wallOwnerPost.getId }}" class="replyFormCheck{% if wallOwnerPost.getReplyForm.show %} formReplyBool{% endif %}" >
                    {% form_theme wallOwnerPost.getReplyForm.form '::baseForm.html.twig' %}
                    <form class="replyForm replyFormShow{{ wallOwnerPost.getId() }}" action="{{ path('MooiWallBundle_WallReplyAdd', {'postId' : wallOwnerPost.getId()}) }}" method="post" autocomplete="off" {{ form_enctype(wallOwnerPost.getReplyForm.form ) }} >
                        <div class="form_row">
                            <div class="clearfix"></div>
                        </div>
                        {{ form_widget(wallOwnerPost.getReplyForm.form ) }}
                        <div class="button">
                            <input type="submit" class="button" value="Plaatsen" />
                            <div class="clearfix"></div>
                        </div>
                    </form>
                </div>
            </div>    
            {% else %}
                {% if warningFilter is defined %}
                    {% if warningFilter == true %}
                        <p class="empty">{{ warningFilter }}</p>
                    {% endif %} 
                {% else %}
                    <p class="empty">Er zijn nog geen berichten op deze Showkees.</p>
                {% endif %}
            {% endfor %} 
        </div>    
        
{% endblock %}

{% block sidebarContent %}
     <div id="filterColumn">
        {% include 'MooiWallBundle:Wall:filter.html.twig' %}
     </div>
{% endblock %}
